<template>
  <view class="phxx-item">
    <view class="phxx-item-content">
      <view class="top">
        <view class="cname-box">
          <view class="cname">{{ itemList.planNo || ''}}
            <uni-icons class="icon-calendar-1" type="minus" color="red" size="15"
              style="padding: 3px;font-weight: bold;" v-if="itemList.planConfig == 1"></uni-icons>
          </view>
          <view class="cname-fu">{{ itemList.cusName || ''}}</view>
        </view>
        <view class="status" :class="{
                  'orange-type': itemList.jyStatus === 1,
                  'green-type': itemList.jyStatus === 2,
                  'red-type': itemList.jyStatus === 3
                 }">
          {{ statusNameMap[itemList.jyStatus] }}
        </view>
      </view>
      <view class="body-box" style="position: relative;">
        <view class="bottom" v-if="orgShow">
          <view class="items">
            <text class="til">所属组织:</text>
            <text class="val">{{ itemList.organizationName || ''}}</text>
          </view>
        </view>
        <view class="bottom">
          <view class="items">
            <text class="til">煤种:</text>
            <text class="val">{{ itemList.joinName || ''}}</text>
          </view>
        </view>
        <view class="bottom">
          <view class="items">
            <text class="til">负责人:</text>
            <text class="val">{{ itemList.userName || '' }}</text>
          </view>
        </view>
        <view class="bottom">
          <view class="items">
            <text class="til">手机号:</text>
            <text class="val">{{ itemList.cusPhone || ''}}</text>
          </view>
        </view>

        <view class="bottom">
          <view class="items" style="display: flex;">
            <text class="til">派单时间:</text>
            <view style="display: flex; flex-direction: column;">
              <text class="val">{{ itemList.startTime || '' }}</text>
              <text class="val">{{ itemList.endTime || '' }}</text>
            </view>
          </view>
        </view>
        <view class="icon-box" style="bottom: 20rpx">
          <image class="cover-img" :src="imagesPath" @click.stop="handleClick(itemList)" mode="aspectFill"></image>
        </view>
      </view>
    </view>
    <view class="footer-btn">
      <button v-if="findCarBtnAuth && itemList.findCarOnPlatformBtn===1" type="primary" plain="true"
        @click.stop="linkToSourceForm(itemList)">平台找车</button>
      <button v-if="goodsSourceBtnAuth && itemList.viewGoodsSourceBtn===1" type="primary" plain="true"
        @click.stop="linkToSourceForm(itemList)">查看货源</button>
    </view>
  </view>
</template>

<script>
  import config from '@/config'
  import { toast } from '@/utils/common';
  import { getButtonShow } from '@/utils/common.js';
  import { getGoodsSourceByPlanId } from '@/api/goodsSource.js';
  export default {
    name: 'row-number',
    props: {
      findCarBtnAuth: {
        type: Boolean,
        default: false
      },
      goodsSourceBtnAuth: {
        type: Boolean,
        default: false
      },
      itemList: {
        type: Object,
        default: {}
      },
      statusList: {
        type: Array,
        default: () => []
      },
      authriotyFlagVoilation: {
        type: Boolean,
        default: false
      },
      orgShow: {
        type: Boolean,
        default: false
      },
      authriotyFlagBlck: {
        type: Boolean,
        default: false
      },
      authriotyFlagupd: {
        type: Boolean,
        default: false
      }
    },
    data() {
      return {
        transStatusLists: []
      }
    },
    computed: {
      imagesPath() {
        if (this.$store.state.user.curTypeColor == "#D22C2C") {
          return config.baseImgUrl + '/code1.png'
        } else if (this.$store.state.user.curTypeColor == "#409EFE") {
          return config.baseImgUrl + '/code.png'
        } else {
          return config.baseImgUrl + '/code.png'
        }
      },
      statusNameMap() {
        const map = {};
        if (this.statusList && this.statusList.length > 0) {
          this.statusList.forEach(item => {
            map[item.value] = item.text;
          });
        }
        return map;
      }
    },
    methods: {
      clickImg() {
        let _ = this;
        uni.previewImage({
          urls: [_.imagesPath]
        });
      },
      handleClick(item) {
        this.$emit('showCode', item);
      },
      async linkToSourceForm(data) {
        if (data.viewGoodsSourceBtn === 1) {
          const res = await getGoodsSourceByPlanId({ planId: data.id })
          if (res.code !== 0) {
            toast(res.msg)
            return;
          }
        }
        this.$tab.navigateTo(`/packageB/pages/sourceForm/index?id=${data.id}&planNo=${data.planNo}&bizType=2&cusId=${data.cusId}&viewGoodsSourceBtn=${data.viewGoodsSourceBtn}&findCarOnPlatformBtn=${data.findCarOnPlatformBtn}`);
      }
    }
  };
</script>

<style lang="scss" scoped>
  .cname,
  .cname-fu {
    font-size: 14px !important;
  }

  .cname-fu {
    margin-top: 4px;
  }

  .items {
    margin-top: 4px;
    font-size: 14px !important;
  }

  .val {
    font-weight: 500;
  }

  .footer-btn {
    padding-top: 20rpx;
    border-top: 2rpx solid #F1F2F5;
  }
</style>